<template>
    <div>
        <el-select v-model="value" placeholder="请选择">
            <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.label"
            ></el-option>
        </el-select>
        <el-button type="primary" @click="add">添加</el-button>
        <p>原始数组: {{ arr }}</p>
        <p>出现次数最多的字母: {{ mostFrequentLetter }}</p>
        <p>字母出现次数记录: {{ letterOccurrences[mostFrequentLetter] }}</p>
    </div>
</template>

<script>
export default {
    data() {
        return {
            arr: ["A", "B", "C", "D", "A", "B", "B", "A"],
            mostFrequentLetter: null,
            options: [
                {
                    value: "选项1",
                    label: "A",
                },
                {
                    value: "选项2",
                    label: "B",
                },
                {
                    value: "选项3",
                    label: "C",
                },
                {
                    value: "选项4",
                    label: "D",
                },
            ],
            value: "",
            letterOccurrences: {},
        };
    },
    methods: {
        findMostFrequentLetter() {
            // 清空字母出现次数记录
            this.letterOccurrences = {};

            // 统计每个字母出现的次数
            for (const letter of this.arr) {
                if (this.letterOccurrences[letter]) {
                    this.letterOccurrences[letter]++;
                } else {
                    this.letterOccurrences[letter] = 1;
                }
            }

            // 找到出现次数最多的字母
            let maxCount = 0;
            for (const letter in this.letterOccurrences) {
                if (this.letterOccurrences[letter] > maxCount) {
                    maxCount = this.letterOccurrences[letter];
                    this.mostFrequentLetter = letter;
                }
            }
        },
        add() {
            if (this.value !== "") {
                this.arr.push(this.value);
                this.findMostFrequentLetter();
            }
        },
    },
    mounted() {
        this.findMostFrequentLetter();
    },
};
</script>
